《Android 基础(二十)》 CoordinatorLayout Behavior

介绍

Interaction behavior plugin for child views of {@link CoordinatorLayout}.
A Behavior implements one or more interactions that a user can take on a child view. These interactions may include drags, swipes, flings, or any other gestures.

@param < V > The View type that this Behavior operates on > >交互行为主要用于CoordinatorLayout的子View。一个Behavior可以在一个字View上实现一个或者多个交互内容。这些交互可能包括拖拽,滑动,滚动或者是其他手势。 >参数V代表这个Behavior可以操作的视图类型 ###类结构
这里写图片描述

基本使用

关注两个方面:
1、实现child view 监听另外一个child view的状态变化,例如大小、位置、显示状态等
关注layoutDependsOn和onDependentViewChanged方法。

2、实现child view监听CoordinatorLayout内NestedScrollingChild的接口实现类的滑动状态
关注onStartNestedScroll和onNestedPreScroll方法。如上一篇博文中提到的NestedScrollView,而不能使用普通的ScrollView

第一种情况,监听View的状态

位置跟随

布局文件

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/main_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context="mraz.com.coordinatorlayoutdemo.ScrollingActivity">

<TextView
android:id="@+id/depentent"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_gravity="top|left"
android:background="#73ff00"
android:gravity="center"
android:text="depentent"
android:textColor="@android:color/black" />

<TextView
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_gravity="top|right"
android:background="#ffee00"
android:gravity="center"
android:text="auto"
android:textColor="@android:color/holo_red_dark"
app:layout_behavior="mraz.com.coordinatorlayoutdemo.FollowingBehavior" />
</android.support.design.widget.CoordinatorLayout>

Behavior

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
package mraz.com.coordinatorlayoutdemo;

import android.content.Context;
import android.support.design.widget.CoordinatorLayout;
import android.support.v4.view.ViewCompat;
import android.util.AttributeSet;
import android.view.View;

/**
* Created by Mraz on 2016/8/15.
*/
public class FollowingBehavior extends CoordinatorLayout.Behavior<View> {
public FollowingBehavior(Context context, AttributeSet attrs) {
super(context, attrs);
}

@Override
public boolean layoutDependsOn(CoordinatorLayout parent, View child, View dependency) {
return (dependency.getId() == R.id.depentent);//依赖左边的View
}

@Override
public boolean onDependentViewChanged(CoordinatorLayout parent, View child, View dependency) {
int offsetX = dependency.getTop() - child.getTop();//拿到左边View和右边view的顶部差距
ViewCompat.offsetTopAndBottom(child, offsetX);//移动
return true;
}
}

效果

这里写图片描述

第二种情况,监听滚动状态

CoordinatorLayout实现NestedScrollingParent接口,

NestedScrollView实现NestedScrollingParent, NestedScrollingChild, ScrollingView接口

1
2
public class NestedScrollView extends FrameLayout implements NestedScrollingParent,
NestedScrollingChild, ScrollingView

简而言之,一个加强的ScrollView,但是实现的这几个接口是怎么回事呢?一个个的看下
NestedScrollingParent

这里写图片描述

接口 含义
onStartNestedScroll child执行startNestedScroll方法的时候会调用,返回true代表代表要和child联动
onNestedScrollAccepted onStartNestedScroll执行完成并返回true之后执行,用于做联动前的准备
onStopNestedScroll nested scroll结束后执行
onNestedScroll nested scroll进行中时执行,传递的参数是消耗了和没有消耗的滚动距离
onNestedPreScroll neseted scroll进行并且target没有消耗滚动时执行,nested scrolling执行dispatchNestedPreScroll后执行该方法
onNestedFling 请求一个滚动结束后的fling
onNestedPreFling target view没有消耗flinger之前执行
getNestedScrollAxes 返回NestedScrollingParent的滚动轴

NestedScrollingChild

这里写图片描述

接口 含义
setNestedScrollingEnabled 设置视图是否可以nested scrolling
isNestedScrollingEnabled 获取当前view是否可以nested scrolling
startNestedScroll 开始执行nested scroll,沿着给点的轴方向,返回true,代表找到了parent
hasNestedScrollingParent 判断nested scrolling是否存在parent
dispatchNestedScroll 派发一个滚动给parent
dispatchNestedPreScroll 在没有消耗之前派发给parent,也就是parent有可能会在child之前消耗
dispatchNestedPreFling 消耗之前派发给parent

ScrollingView

这里写图片描述

接口 含义
computeHorizontalScrollRange 计算横向滚动的范围
computeHorizontalScrollOffset 计算横向偏移量
computeHorizontalScrollExtent 计算横向额外距离
computeVerticalScrollRange 滚动视图的可滚动范围是所有子元素的高度
computeVerticalScrollOffset 计算垂直方向滚动条的滑块的偏移。此值用来计算滚动条轨迹的滑块的位置
computeVerticalScrollExtent 计算纵向额外距离

这里写图片描述

这里写图片描述
基本上方法和上面的比较类似,不赘述

布局文件

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/main_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
android:scrollbars="vertical"
tools:context="mraz.com.coordinatorlayoutdemo.ScrollingActivity">

<android.support.v4.widget.NestedScrollView
android:layout_width="wrap_content"
android:layout_height="wrap_content">

<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">

<TextView
android:layout_width="100dp"
android:layout_height="200dp"
android:layout_gravity="top|left"
android:background="#73ff00"
android:gravity="center"
android:text="depentent"
android:textColor="@android:color/black" />

<TextView
android:layout_width="100dp"
android:layout_height="200dp"
android:layout_gravity="top|left"
android:background="#73ff00"
android:gravity="center"
android:text="depentent"
android:textColor="@android:color/black" />

<TextView
android:layout_width="100dp"
android:layout_height="200dp"
android:layout_gravity="top|left"
android:background="#73ff00"
android:gravity="center"
android:text="depentent"
android:textColor="@android:color/black" />

<TextView
android:layout_width="100dp"
android:layout_height="200dp"
android:layout_gravity="top|left"
android:background="#73ff00"
android:gravity="center"
android:text="depentent"
android:textColor="@android:color/black" />

<TextView
android:layout_width="100dp"
android:layout_height="200dp"
android:layout_gravity="top|left"
android:background="#73ff00"
android:gravity="center"
android:text="depentent"
android:textColor="@android:color/black" />

<TextView
android:layout_width="100dp"
android:layout_height="200dp"
android:layout_gravity="top|left"
android:background="#73ff00"
android:gravity="center"
android:text="depentent"
android:textColor="@android:color/black" />

<TextView
android:layout_width="100dp"
android:layout_height="200dp"
android:layout_gravity="top|left"
android:background="#73ff00"
android:gravity="center"
android:text="depentent"
android:textColor="@android:color/black" />

<TextView
android:layout_width="100dp"
android:layout_height="200dp"
android:layout_gravity="top|left"
android:background="#73ff00"
android:gravity="center"
android:text="depentent"
android:textColor="@android:color/black" />

<TextView
android:layout_width="100dp"
android:layout_height="200dp"
android:layout_gravity="top|left"
android:background="#73ff00"
android:gravity="center"
android:text="depentent"
android:textColor="@android:color/black" />
</LinearLayout>
</android.support.v4.widget.NestedScrollView>

<android.support.v4.widget.NestedScrollView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
app:layout_behavior="mraz.com.coordinatorlayoutdemo.MyScrollingBehavior">

<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">

<TextView
android:layout_width="100dp"
android:layout_height="200dp"
android:layout_gravity="top|left"
android:background="#ff00aa"
android:gravity="center"
android:text="right"
android:textColor="@android:color/black" />

<TextView
android:layout_width="100dp"
android:layout_height="200dp"
android:layout_gravity="top|left"
android:background="#ff00aa"
android:gravity="center"
android:text="right"
android:textColor="@android:color/black" />

<TextView
android:layout_width="100dp"
android:layout_height="200dp"
android:layout_gravity="top|left"
android:background="#ff00aa"
android:gravity="center"
android:text="right"
android:textColor="@android:color/black" />

<TextView
android:layout_width="100dp"
android:layout_height="200dp"
android:layout_gravity="top|left"
android:background="#ff00aa"
android:gravity="center"
android:text="right"
android:textColor="@android:color/black" />

<TextView
android:layout_width="100dp"
android:layout_height="200dp"
android:layout_gravity="top|left"
android:background="#ff00aa"
android:gravity="center"
android:text="right"
android:textColor="@android:color/black" />

<TextView
android:layout_width="100dp"
android:layout_height="200dp"
android:layout_gravity="top|left"
android:background="#ff00aa"
android:gravity="center"
android:text="right"
android:textColor="@android:color/black" />

<TextView
android:layout_width="100dp"
android:layout_height="200dp"
android:layout_gravity="top|left"
android:background="#ff00aa"
android:gravity="center"
android:text="right"
android:textColor="@android:color/black" />

<TextView
android:layout_width="100dp"
android:layout_height="200dp"
android:layout_gravity="top|left"
android:background="#ff00aa"
android:gravity="center"
android:text="right"
android:textColor="@android:color/black" />

<TextView
android:layout_width="100dp"
android:layout_height="200dp"
android:layout_gravity="top|left"
android:background="#ff00aa"
android:gravity="center"
android:text="right"
android:textColor="@android:color/black" />
</LinearLayout>
</android.support.v4.widget.NestedScrollView>

<android.support.v4.widget.NestedScrollView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right"
app:layout_behavior="mraz.com.coordinatorlayoutdemo.MyScrollingBehavior">

<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">

<TextView
android:layout_width="100dp"
android:layout_height="200dp"
android:layout_gravity="top|left"
android:background="#ffe600"
android:gravity="center"
android:text="right"
android:textColor="@android:color/black" />

<TextView
android:layout_width="100dp"
android:layout_height="200dp"
android:layout_gravity="top|left"
android:background="#ffe600"
android:gravity="center"
android:text="right"
android:textColor="@android:color/black" />

<TextView
android:layout_width="100dp"
android:layout_height="200dp"
android:layout_gravity="top|left"
android:background="#ffe600"
android:gravity="center"
android:text="right"
android:textColor="@android:color/black" />

<TextView
android:layout_width="100dp"
android:layout_height="200dp"
android:layout_gravity="top|left"
android:background="#ffe600"
android:gravity="center"
android:text="right"
android:textColor="@android:color/black" />

<TextView
android:layout_width="100dp"
android:layout_height="200dp"
android:layout_gravity="top|left"
android:background="#ffe600"
android:gravity="center"
android:text="right"
android:textColor="@android:color/black" />

<TextView
android:layout_width="100dp"
android:layout_height="200dp"
android:layout_gravity="top|left"
android:background="#ffe600"
android:gravity="center"
android:text="right"
android:textColor="@android:color/black" />

<TextView
android:layout_width="100dp"
android:layout_height="200dp"
android:layout_gravity="top|left"
android:background="#ffe600"
android:gravity="center"
android:text="right"
android:textColor="@android:color/black" />

<TextView
android:layout_width="100dp"
android:layout_height="200dp"
android:layout_gravity="top|left"
android:background="#ffe600"
android:gravity="center"
android:text="right"
android:textColor="@android:color/black" />

<TextView
android:layout_width="100dp"
android:layout_height="200dp"
android:layout_gravity="top|left"
android:background="#ffe600"
android:gravity="center"
android:text="right"
android:textColor="@android:color/black" />
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CoordinatorLayout>

Behavior

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
package mraz.com.coordinatorlayoutdemo;

import android.content.Context;
import android.support.design.widget.CoordinatorLayout;
import android.support.v4.view.ViewCompat;
import android.support.v4.widget.NestedScrollView;
import android.util.AttributeSet;
import android.view.View;

public class MyScrollingBehavior extends CoordinatorLayout.Behavior {
public MyScrollingBehavior(Context context, AttributeSet attrs) {
super(context, attrs);
}

@Override
public boolean onStartNestedScroll(CoordinatorLayout coordinatorLayout, View child, View directTargetChild, View target, int nestedScrollAxes) {
return (nestedScrollAxes & ViewCompat.SCROLL_AXIS_VERTICAL) != 0;//只对垂直滚动感兴趣
}

@Override
public void onNestedPreScroll(CoordinatorLayout coordinatorLayout, View child, View target, int dx, int dy, int[] consumed) {
super.onNestedPreScroll(coordinatorLayout, child, target, dx, dy, consumed);
int leftScrolled = target.getScrollY();//获取左侧滚动距离
child.setScrollY(leftScrolled);//设置联动
}

@Override
public boolean onNestedPreFling(CoordinatorLayout coordinatorLayout, View child, View target, float velocityX, float velocityY) {
((NestedScrollView) child).fling((int) velocityY);//松手后速度传递下去
return true;
}
}

效果

这里写图片描述

Your browser is out-of-date!

Update your browser to view this website correctly. Update my browser now

×